<template>
  <a-dialog-keep :visible="open" title="批量拨打电话" width="800px">
    <el-form label-position="left" class="demo-table-expand" label-width="100px" size="mini">
      <el-row>
        <el-col :span="24">
          <el-form-item label="呼叫人员" prop="cate">
            {{ userNames }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="内容形式">
            <el-select v-model="formData.contentType" placeholder="请选择内容形式">
              <el-option label="文字转语音" :value="1" />
              <el-option label="语音录制" :value="2" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="呼叫内容">
            <template v-if="formData.contentType == 1">
              <el-input v-model="formData.content" type="textarea" placeholder="请输入文字呼叫内容" :style="{ width: '100%' }"
                :rows="5">
              </el-input>
            </template>
            <template v-else>
              <radio-record />
            </template>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="同时发送">
            <el-checkbox-group v-model="formData.syncSend">
              <el-checkbox label="短信"></el-checkbox>
              <el-checkbox label="传真"></el-checkbox>
              <el-checkbox label="邮件"></el-checkbox>
            </el-checkbox-group>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="cancel" size="mini">关闭</el-button>
      <el-button type="primary" @click="handleCall" size="mini">确认拨打</el-button>
    </div>
  </a-dialog-keep>
</template>

<script>
import dialogMixin from '@/mixins/dialogMixin';
import RadioRecord from './RadioRecord.vue';
export default {
  name: 'BatchCallDialog',
  mixins: [dialogMixin],
  components: { RadioRecord },
  data() {
    return {
      formData: {
        contentType: 2,
        syncSend: [],
        users: []
      },
      userNames: '',
    }
  },
  methods: {
    show(users) {
      let userNames = [];
      users.forEach(u => {
        userNames.push(u.nickName);
      })
      this.userNames = userNames.join(',')
      this.users = users;
      this.open = true;
    },
    cancel() {
      this.open = false;
    },
    handleCall() {
      this.$modal.loading("正在批量呼叫...");
      setTimeout(() => {
        this.$modal.closeLoading();
        this.open = false;
        this.$modal.msgSuccess('已批量完成呼叫')
      }, 2000);
    }
  }
}
</script>

<style lang="scss" scoped>

</style>